<template>
    <div class="select-project">
        <div class="project-content">
            <span class="select-project-title">项目</span>
            <span class="select-project-titles">项目名称</span>
            <span @click="jumpSelect" class="select-project-content"
                  :style="{color:projectName?'#323233':'#969799'}">
                {{projectName?projectName:'请选择项目名称'}}
            </span>
        </div>

    </div>

</template>

<script>
    export default {
        name: "selectProject",
        props:["projectName","infoId"],
        data(){
            return{

            }
        },
        methods:{
            jumpSelect(){
                if (!this.infoId){
                    this.$router.push({
                        name:'selectProject'
                    })
                }
            }
        }
    }
</script>

<style scoped lang="scss">
    .select-project{
        margin-bottom: 5px;
        box-sizing: border-box;
        background: #ffffff;
        .project-content{
            display: flex;
            align-items: flex-start;
            justify-content: flex-start;

            .select-project-title{
                width: 58px;
                font-size: 17px;
                color: #007CF9;
                flex-shrink: 0;
                font-weight: 600;
                padding: 16px 0 20px 12px;
            }
            .select-project-titles{
                color: #646566;
                padding: 14px 0;
                font-size: 14px;
                width: 88px;
                padding: 20px 0 20px 0;
                flex-shrink: 0;
            }
            .select-project-content{
                font-size: 16px;
                padding: 20px 10px 20px 0;
                flex: 1;
            }
        }

    }
</style>